const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ExtractTextPlugin = require("extract-text-webpack-plugin");

const config = {
	entry: './src/main.js',
	output: {
		filename: 'js/[name].bundle.js',
		path: path.resolve(__dirname, './dist')
	},
	module: {
		rules: [
			{
				test: /\.js$/,
				use: 'babel-loader',
				exclude: '/node_modules/'
			},
			{
				test: /\.vue$/,
				use: 'vue-loader'
			},
			{
				test: /\.scss$/,
				use: ExtractTextPlugin.extract({
                    fallback: 'style-loader',
                    use: [{
						loader: 'style-loader'
					},
					{
						loader: 'css-loader'
					},
					{
						loader: 'sass-loader'
					}]
				})
			}
		]
	},
    plugins: [
        new HtmlWebpackPlugin({
            template: 'index.html'
        }),
		//不起作用
        new ExtractTextPlugin("styles.css")
    ],
	resolve: {
        extensions: ['.js', '.json', '.css', '.vue', '.scss', '.sass'],
        alias: {
            'vue': 'vue/dist/vue.js',
			'@': path.resolve('src')
		}

	}
}

module.exports = config ;